<template>
  <!-- 聊天输入框 -->
  <div class="chat-board elevation-1" :class="{'show-tool': showTool}"  :style="{height: ((height) + 300) + 'px'}">
    <div class="shutup-panel" v-if="shutup" @click="onShutupClicked"></div>

    <div class="input-box">
      <div class="send" @click="onSwitchSoundBox">
        <!-- <i class="fa fa-smile-o fa-lg"></i> -->
        <img src="@/assets/icons/voice.svg" alt class="svg-icon" />
      </div>
      <div class="input">
        <input
          type="text"
          id="msg-input"
          ref="msgInput"
          v-if="showInput"
          v-model="messageText"
          @focus="showTool = false"
          @blur="onInputBlur"
          @keyup.enter="sendText"
        />
        <div
          v-else
          class="sound-input"
          v-hammer:press="onSoundPress"
          v-hammer:pressup="onSoundPressUp"
          v-hammer:pan="onSoundSwipeUp"
        >
        <!-- <div class="mask" @click.stop="(ev)=>{ev.preventDefault()}"></div> -->
          <span v-if="showRecording" @click.stop="(ev)=>{ev.preventDefault()}">录制中...</span>
          <span v-else  @click.stop="(ev)=>{ev.preventDefault()}">按住 说话</span>
        </div>
      </div>
      <div @click="onActionFace" class="send flex-center">
        <img src="@/assets/icons/smile.svg" alt class="svg-icon emoji" v-if="showFaceList" />
        <img src="@/assets/icons/keyboard.svg" alt class="svg-icon" v-else />
      </div>
      <div class="send flex-center" @click="onActionAdd" v-if="messageText === ''">
        <img src="@/assets/icons/add.svg" alt class="svg-icon" />
      </div>
      <div class="send send-1 flex-center" @click="sendText" v-else>
        <div class="send-button">发送</div>
      </div>
    </div>

    <div class="tool-box flexbox justify-center align-start">
      <div class="tool-wrapper">

      <ul class="tool-list" v-if="!showFaceList && !showKeywordList">
        <!-- emoji表情 -->
        <!-- <li class="list-item">
          <i class="fa fa-smile-o fa-lg"></i>
        </li>-->
        <!-- 自带表情 -->
        <li class="list-item photo-tool">
          <input type="file" accept="image/*" class="file-input" @change="onImageChange" />
          <img src="@/assets/images/photo.png" alt class="item-image tool-image" />
          <span>图片</span>
        </li>
        <!-- 群助手-->
        <li class="list-item" @click="onGotoGroupHelper">
          <img src="@/assets/images/group_helper.png" alt class="item-image" />
          <span>群助手</span>
        </li>
        <li class="list-item" @click="onSendRedpacket">
          <img src="@/assets/images/redpacket.png" alt class="item-image" />
          <span>蓝卡</span>
        </li>
      </ul>

      <cube-slide ref="slide" :data="faceItems" v-if="showFaceList" :loop="false" :autoPlay="false" @change="onChangePage">
        <cube-slide-item
          v-for="(item, i) in faceItems"
          :key="i">
          <!-- 表情列表 -->
          <ul class="face-list">
            <li class="face" v-for="(subItem, j) of item" :key="j" @click="onAddFace(subItem, j)">
              <img :src="require(`@/assets/emoji/${subItem.value}.gif`)" :alt="subItem.text" srcset />
            </li>
          </ul>
        </cube-slide-item>
        <template slot="dots" slot-scope="props">
          <span class="my-dot" :class="{active: props.current === i}" v-for="(item, i) in props.dots">{{i + 1}}</span>
        </template>
      </cube-slide>

      <ul class="helper-list" v-if="showKeywordList">
        <li v-for="(item, i) of keywordList" :key="i" @click="onKeywordClicked(item)">
          <span>{{ item.keywordName }}</span>
        </li>
      </ul>
      </div>
    </div>
    <!-- 弹出提示层 -->
    <div class="sound-popup flex-center column" v-if="showRecording">
      <img src="@/assets/icons/recorder.svg" alt class="recorder-image" />
      <div>向上滑动取消</div>
    </div>

    <!-- 发送图片之前的预览 -->
    <send-image-preview
      v-if="showImagePreview"
      :image="imageBase64"
      @cancel="onCancelImage"
      @send="onSendImage"
    />
  </div>
</template>

<script lang="ts">
import { Component, Vue, Prop, Watch } from "vue-property-decorator";
// import Recorder from 'recorderjs';
import {
  Msg,
  Session,
  Webim,
  Text,
  Face,
  Images,
  GroupTip,
  Sound
} from "@/utils/types";
import { Action, Mutation, Getter, namespace } from "vuex-class";
import { FaceList, FaceListKV } from "@/utils/constants";
import MessageMixin from '@/mixins';
import { MsgTypeKV } from '@/api/socket/imClient';
import { endsWith, chunk } from 'lodash';
declare const $Vue: Vue;
declare const wx: any;
declare const webim: Webim;
const chatModule = namespace("chatModule");
const userModule = namespace("userModule");

@Component({
  mixins: [MessageMixin],
})
export default class ChatBoard extends Vue {
  @userModule.State("selToID") selToID: any;
  @userModule.State("selSess") selSess: any;
  @userModule.State("selType") selType: any;
  @userModule.State("loginInfo") loginInfo: any;
  @userModule.State("friendHeadUrl") friendHeadUrl: any;
  @userModule.Action("saveSelSessFN") saveSelSessFN: any;
  @userModule.Action("saveSelToIDFN") saveSelToIDFN: any;

  @chatModule.State("groupSetting") groupSetting: any;

  @Prop({})
  chat: any;

  @Prop({})
  shutup: any;

  @Prop({})
  height: any;

  @Watch('showTool')
  boardChange(newVal: boolean, oldVal: boolean) {
    $Vue.$emit('setShowTool', newVal);
  }

  /**
   * 表情删除
   */
  @Watch('messageText')
  messageChange(newVal: string, oldVal: string) {
    let nlen = newVal.length;
    let olen = oldVal.length;
    // 比较长短
    if (olen > nlen && olen >= 3) {
      // 删除
      if (endsWith(oldVal, ']')) {
        if (newVal[nlen - 3] === '[') {
          this.messageText = newVal.substring(0, nlen - 3)
        }
        if (newVal[nlen - 2] === '[') {
          this.messageText = newVal.substring(0, nlen - 2)
        }

      }
    }
  }


  // 输入时显示发送按钮
  private showAdd: boolean = true;

  private showTool: boolean = false;

  // 是否显示语音输入
  private showInput: boolean = true;
  // 是否正在录音
  private showRecording: boolean = false;

  private messageText: string = "";

  private imageBase64: string = "";
  private imageFile: any = null;
  private showImagePreview: boolean = false;

  private faceList: any = FaceList;

  private eventList: Array<string> = [
    'hideToolBox',
    'onHeadPressed',
    '$getSoundUrl',
    '$getGroupHelper',
    '$selectKeyword',
  ];

  private showToolList: boolean = true;

  private showFaceList: boolean = false;
  // 显示群助手
  private showKeywordList: boolean = false;

  private keywordList: Array<any> = [];

  private faceItems: Array<any> = [];

  protected mounted() {
    this.initEvents(this.eventList);
    this.addBlur();
    this.getFaceChunk();
  }

  /**
   * 获取表情分页
   */
  private getFaceChunk() {
    this.faceItems = chunk(FaceListKV, 21);
  }

  private onChangePage() {

  }

  /**
   * 长按头像@ 
   */
  private onHeadPressed({ data }: any) {
    if (!data.isSelf) {
      // this.messageText += ` @${data.fromAccountNick} `
    }
  }

  /**
   * 失去焦点
   */
  private onInputBlur() {
    this.showTool = false;
  }

  /**
   * input点击失效问题
   */
  private addBlur() {
    let input: any = document.querySelector("#msg-input");
    // input.focus();
    input.onblur = function () {
      setTimeout(function () {
        let scrollHeight =
          document.documentElement.scrollTop || document.body.scrollTop || 0;
        window.scrollTo(0, Math.max(scrollHeight - 1, 0));
      }, 100);
    };
  }

  /**
   * 按下确认发送
   */
  private sendText() {

    if (this.messageText === '') {
      return this.$createToast({
        txt: '请输入消息内容',
        type: "warn",
        time: 3000
      }).show();
    }

    const isSend = true; // 是否为自己发送
    const seq = -1; // 消息序列，-1表示 IM SDK 自动生成，用于去重
    const random = Math.round(Math.random() * 4294967296); //消息随机数，用于去重
    const msgTime = Math.round(new Date().getTime()); //消息时间戳
    let selSess = webim.MsgStore.sessByTypeId(
      webim.SESSION_TYPE.GROUP,
      this.selToID
    );
    if (!selSess) {
      selSess = new webim.Session(
        this.selType,
        this.selToID,
        this.selToID,
        this.friendHeadUrl,
        Math.round(new Date().getTime())
      );
    }
    this.saveSelSessFN(selSess);
    let msg = new webim.Msg(
      selSess,
      isSend,
      seq,
      random,
      msgTime,
      this.loginInfo.identifier,
      webim.C2C_MSG_SUB_TYPE.COMMON,
      this.loginInfo.identifierNick
    );

    // 解析文本和表情
    let textObj, faceObj, tmsg, emotionIndex, emotion, restMsgIndex;
    let msgToSend = this.messageText;
    let expr = /\[[^[\]]{1,3}\]/gm;
    let emotions = msgToSend.match(expr);
    // 没有包含表情
    if (!emotions || emotions.length < 1) {
      textObj = new webim.Msg.Elem.Text(msgToSend);
      msg.addText(textObj);
    } else {
      for (let i = 0; i < emotions.length; i++) {
        tmsg = msgToSend.substring(0, msgToSend.indexOf(emotions[i]));
        if (tmsg) {
          textObj = new webim.Msg.Elem.Text(tmsg);
          msg.addText(textObj);
        }
        emotionIndex = FaceList[emotions[i]];
        // emotion = webim.Emotions[emotionIndex];
        emotion = emotions[i];
        if (emotionIndex) {
          faceObj = new webim.Msg.Elem.Face(emotionIndex, emotions[i]);
          msg.addFace(faceObj);
        } else {
          textObj = new webim.Msg.Elem.Text(emotions[i]);
          msg.addText(textObj);
        }
        restMsgIndex = msgToSend.indexOf(emotions[i]) + emotions[i].length;
        msgToSend = msgToSend.substring(restMsgIndex);
      }
      if (msgToSend) {
        textObj = new webim.Msg.Elem.Text(msgToSend);
        msg.addText(textObj);
      }
    }

    // msg.addText(msg);
    // 发送文本信息
    webim.sendMsg(
      msg,
      () => {
        // webim.Tool.setCookie("tmpmsg_" + this.selToID, "", 0);
        this.messageText = "";
        this.showTool = false;
        // this.inputFocus();
      },
      (err) => {

      }
    );
  }

  /**
   * 已禁言
   */
  private onShutupClicked() {
    // this.$createToast({
    //   txt: '当前群聊已禁言',
    //   type: "warn",
    //   time: 3000
    // }).show();
  }

  /**
   * 显示
   */
  private onSwitchSoundBox() {
    this.showInput = !this.showInput;
    this.showRecording = false;
    this.showTool = false;
    this.showToolList = true;
    this.showFaceList = false;
    this.showKeywordList = false;
  }

  /**
   * 表情按钮 打开表情面板
   */
  private onActionFace() {
    this.showKeywordList = false;
    if (this.showTool && this.showToolList) {
      this.showToolList = false;
      this.showFaceList = true;
    } else {
      this.showRecording = false;
      this.showTool = !this.showTool;
      this.showInput = true;
      this.showToolList = false;
      this.showFaceList = true;
    }
  }

  /**
   * 添加按钮 显示其他输入操作
   */
  private onActionAdd() {
    this.showKeywordList = false;
    if (this.showTool && this.showFaceList) {
      this.showToolList = true;
      this.showFaceList = false;
    } else {
      this.showRecording = false;
      this.showInput = true;
      this.showTool = !this.showTool;
      this.showToolList = true;
      this.showFaceList = false;
    }
  }

  private hideToolBox() {
    this.showTool = false;
  }


  private inputFocus() {
    let input: any = document.querySelector("#msg-input");
    input.focus();
  }


  /**
   * 添加表情
   */
  private onAddFace(item: any, i: string) {
    this.messageText += item.text;
  }


  /**
   * 选取图片用于发送
   */
  private onImageChange(ev: any) {
    let file = ev.target.files[0];
    this.handleImageFile(file);
    this.imageFile = file;
    this.showImagePreview = true;
  }

  private handleImageFile(file: File) {
    const reader = new FileReader();
    // 使用base64上传
    reader.onload = (ev: any) => {
      this.imageBase64 = ev.target.result;
    };
    reader.readAsDataURL(file);
  }

  /**
   * 发送图片
   */
  private onSendImage() {
    this.uploadImage(this.imageFile);
    this.showImagePreview = false;
    this.showTool = false;
  }

  /**
   * 取消发送
   */
  private onCancelImage() {
    this.showImagePreview = false;
  }

  /**
   * 按住音频按钮
   */
  private onSoundPress(ev) {
    ev.preventDefault();
    document.oncontextmenu = function(e){
      e.preventDefault();
    };
    this.showRecording = true;
    // 开始录音
    wx.startRecord(); // 防止第一次弹框 TODO
    // 这里的 800 是血的教训，开始为了快写了10，
    //坑爹的发现 ios会失败，而安卓正常，最后发现是stop本身异步，太快调用fail都不会执行，坑点之一

    wx.onVoiceRecordEnd({
      // 录音时间超过一分钟没有停止的时候会执行 complete 回调
      complete: function (res) {
        let localId = res.localId;
        // 关闭录音
        this.showRecording = false;
        wx.uploadVoice({
          localId, // 需要上传的音频的本地ID，由stopRecord接口获得
          isShowProgressTips: 1, // 默认为1，显示进度提示
          success: upRes => {
            let serverId = upRes.serverId; // 返回音频的服务器端ID
            // 使用自定义消息发送服务端id;
            // this.sendSound(serverId);
            this.sendMessage(MsgTypeKV.getSoundUrl, {
              mediaId: serverId,
            });
          }
        });
      }
    });
  }

  /**
   * 松开发送音频按钮
   */
  private onSoundPressUp(ev) {
    ev.preventDefault();
    document.oncontextmenu = function(e){
      // e.preventDefault();
    };
    this.showRecording = false;
    wx.stopRecord({
      success: recRes => {
        let localId = recRes.localId;
        // 获取生成的本地资源id
        wx.uploadVoice({
          localId, // 需要上传的音频的本地ID，由stopRecord接口获得
          isShowProgressTips: 1, // 默认为1，显示进度提示
          success: upRes => {
            let serverId = upRes.serverId; // 返回音频的服务器端ID
            // 将服务端id发送到后台获取
            this.sendMessage(MsgTypeKV.getSoundUrl, {
              mediaId: serverId,
            });
          }
        });
      }
    });

  }

  /**
   * 使用自定义消息发送声音
   */
  private sendSound(mediaUrl: any) {
    if (!this.selToID) {
      // selToID 为全局变量，表示当前正在进行的聊天 ID，当聊天类型为私聊时，该值为好友帐号，否则为群号。
      this.$createToast({
        txt: "您还没有好友或群组，暂不能聊天",
        type: "warn",
        time: 3000
      }).show();
      return;
    }

    let data = JSON.stringify({
      mediaUrl,
    });
    let desc = "message-sound";
    let ext = "";
    let msgLen = webim.Tool.getStrBytes(data);
    if (data.length < 1) {
      this.$createToast({
        txt: "发送的消息不能为空!",
        type: "warn",
        time: 3000,
      }).show();
      return;
    }
    let maxLen, errInfo;
    if (this.selType == webim.SESSION_TYPE.C2C) {
      maxLen = webim.MSG_MAX_LENGTH.C2C;
      errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
    } else {
      maxLen = webim.MSG_MAX_LENGTH.GROUP;
      errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
    }
    if (msgLen > maxLen) {
      this.$createToast({
        txt: errInfo,
        type: "warn",
        time: 3000
      }).show();
      return;
    }
    let selSess = webim.MsgStore.sessByTypeId(
      webim.SESSION_TYPE.GROUP,
      this.selToID
    );
    if (!selSess) {
      selSess = new webim.Session(
        this.selType,
        this.selToID,
        this.selToID,
        this.friendHeadUrl,
        Math.round(new Date().getTime())
      );
      this.saveSelSessFN(selSess);
    }

    let msg = new webim.Msg(
      selSess,
      true,
      -1,
      -1,
      -1,
      this.loginInfo.identifier,
      0,
      this.loginInfo.identifierNick
    );
    let customObj = new webim.Msg.Elem.Custom(data, desc, ext);
    msg.addCustom(customObj);
    //调用发送消息接口
    webim.sendMsg(
      msg,
      (resp) => { },
      (err) => {
        this.$createToast({
          txt: err.ErrorInfo,
          type: "warn",
          time: 3000
        }).show();
      }
    );
  }

  /**
   * 使用自定义消息发送卡片信息
   */
  private sendShareCard(card: any) {
    if (!this.selToID) {
      // selToID 为全局变量，表示当前正在进行的聊天 ID，当聊天类型为私聊时，该值为好友帐号，否则为群号。
      this.$createToast({
        txt: "您还没有选择群，暂不能聊天",
        type: "warn",
        time: 3000
      }).show();
      return;
    }
    let data = JSON.stringify(card);
    let desc = "message-card";
    let ext = "share";
    let msgLen = webim.Tool.getStrBytes(data);
    if (data.length < 1) {
      return;
    }
    let maxLen, errInfo;
    if (this.selType == webim.SESSION_TYPE.C2C) {
      maxLen = webim.MSG_MAX_LENGTH.C2C;
      errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
    } else {
      maxLen = webim.MSG_MAX_LENGTH.GROUP; // 八千字节
      errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
    }
    if (msgLen > maxLen) {
      this.$createToast({
        txt: errInfo,
        type: "warn",
        time: 3000
      }).show();
      return;
    }
    let selSess = webim.MsgStore.sessByTypeId(
      webim.SESSION_TYPE.GROUP,
      this.selToID,
    );
    if (!selSess) {
      selSess = new webim.Session(
        this.selType,
        this.selToID,
        this.selToID,
        this.friendHeadUrl,
        Math.round(new Date().getTime())
      );
      this.saveSelSessFN(selSess);
    }

    let msg = new webim.Msg(
      selSess,
      true,
      -1,
      -1,
      -1,
      this.loginInfo.identifier,
      0,
      this.loginInfo.identifierNick
    );
    let customObj = new webim.Msg.Elem.Custom(data, desc, ext);
    msg.addCustom(customObj);
    //调用发送消息接口
    webim.sendMsg(
      msg,
      (resp) => { },
      (err) => {
        // this.$createToast({
        //   txt: err.ErrorInfo,
        //   type: "warn",
        //   time: 3000
        // }).show();
      }
    );

  }

  /**
   * 发送自定义的tip消息
   */
  private sendCustomTip(tip: any) {
    if (!this.selToID) {
      // selToID 为全局变量，表示当前正在进行的聊天 ID，当聊天类型为私聊时，该值为好友帐号，否则为群号。
      this.$createToast({
        txt: "您还没有选择群，暂不能聊天",
        type: "warn",
        time: 3000
      }).show();
      return;
    }

    let data = JSON.stringify(tip.content);
    let desc = "message-tip";
    let ext = tip.ext;
    let msgLen = webim.Tool.getStrBytes(data);
    if (data.length < 1) {
      return;
    }
    let maxLen, errInfo;
    if (this.selType == webim.SESSION_TYPE.C2C) {
      maxLen = webim.MSG_MAX_LENGTH.C2C;
      errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
    } else {
      maxLen = webim.MSG_MAX_LENGTH.GROUP; // 八千字节
      errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
    }
    if (msgLen > maxLen) {
      this.$createToast({
        txt: errInfo,
        type: "warn",
        time: 3000
      }).show();
      return;
    }
    let selSess = webim.MsgStore.sessByTypeId(
      webim.SESSION_TYPE.GROUP,
      this.selToID,
    );
    if (!selSess) {
      selSess = new webim.Session(
        this.selType,
        this.selToID,
        this.selToID,
        this.friendHeadUrl,
        Math.round(new Date().getTime())
      );
      this.saveSelSessFN(selSess);
    }

    let msg = new webim.Msg(
      selSess,
      true,
      -1,
      -1,
      -1,
      this.loginInfo.identifier,
      0,
      this.loginInfo.identifierNick
    );
    let customObj = new webim.Msg.Elem.Custom(data, desc, ext);
    msg.addCustom(customObj);
    //调用发送消息接口
    webim.sendMsg(
      msg,
      (resp) => { },
      (err) => {
        // this.$createToast({
        //   txt: err.ErrorInfo,
        //   type: "warn",
        //   time: 3000
        // }).show();
      }
    );

  }

  /**
   * 向上滑动取消录音
   */
  private onSoundSwipeUp(ev: any) {
    let eventName = ev.additionalEvent;
    document.oncontextmenu = function(e){
      // e.preventDefault();
    };
    ev.preventDefault();
    // 向上滑动
    if (eventName === "panup") {
      this.showRecording = false;
    }
  }

  /**
   * 上传图片
   */
  private uploadImage(file: File) {
    let businessType = webim.UPLOAD_PIC_BUSSINESS_TYPE.GROUP_MSG; //业务类型，1-发群图片，2-向好友发图片
    // if (this.selType == SESSION_TYPE.C2C) {
    //   //向好友发图片
    //   businessType = webim.UPLOAD_PIC_BUSSINESS_TYPE.C2C_MSG;
    // } else if (this.selType == SESSION_TYPE.GROUP) {
    //发群图片
    // }
    //封装上传图片请求
    let opt = {
      file, //图片对象
      onProgressCallBack: this.onProgressCallBack, //上传图片进度条回调函数
      //'abortButton': document.getElementById('upd_abort'), //停止上传图片按钮
      From_Account: this.loginInfo.identifier, //发送者帐号
      To_Account: this.selToID, //接收者，selToID 为全局变量，表示当前正在进行的聊天 ID，当聊天类型为私聊时，该值为好友帐号，否则为群号。
      businessType //业务类型
    };
    //上传图片
    webim.uploadPic(
      opt,
      (resp: any) => {
        console.log("uploadPic", resp);
        //上传成功发送图片
        this.sendImage(resp);
      },
      (err: any) => {

        this.$createToast({
          txt: err.ErrorInfo,
          type: "warn",
          time: 3000
        }).show();
      }
    );
  }

  /**
   * 发送图片消息
   */
  private sendImage(images: any) {
    if (!this.selToID) {
      this.$createToast({
        txt: "您还没有选择群，暂不能聊天",
        type: "warn",
        time: 3000
      }).show();
      return;
    }

    let selSess = webim.MsgStore.sessByTypeId(
      webim.SESSION_TYPE.GROUP,
      this.selToID
    );
    if (!selSess) {
      selSess = new webim.Session(
        this.selType,
        this.selToID,
        this.selToID,
        this.friendHeadUrl,
        Math.round(new Date().getTime())
      );
      this.saveSelSessFN(selSess);
    }

    let msg = new webim.Msg(selSess, true);
    let imageList = new webim.Msg.Elem.Images(images.File_UUID);
    for (let i in images.URL_INFO) {
      let img = images.URL_INFO[i];
      let newImg;
      let type;
      switch (img.PIC_TYPE) {
        case 1: //原图
          type = 1; //原图
          break;
        case 2: //小图（缩略图）
          type = 3; //小图
          break;
        case 4: //大图
          type = 2; //大图
          break;
      }
      newImg = new webim.Msg.Elem.Images.Image(
        type,
        img.PIC_Size,
        img.PIC_Width,
        img.PIC_Height,
        img.DownUrl
      );
      imageList.addImage(newImg);
    }
    msg.addImage(imageList);
    //调用发送图片接口
    webim.sendMsg(
      msg,
      (resp: any) => {
        this.addMsg(msg);
      },
      (err: any) => {
        this.$createToast({
          txt: err.ErrorInfo,
          type: "warn",
          time: 3000
        }).show();
      }
    );
  }

  private addMsg(msg: any) { }

  /**
   * 上传图片进度条回调函数
   */
  private onProgressCallBack(progress: any) {
    console.warn("onProgressCallBack", progress);
  }

  private onGotoGroupHelper() {
    this.showKeywordList = true;
    this.showToolList = false;
    this.showFaceList = false;
    this.sendMessage(MsgTypeKV.getGroupHelper);
  }

  /**
   * 
   */
  private onSendRedpacket() {
    this.showTool = false;
    this.showToolList = false;
    this.showFaceList = false;
    this.$emit('redpacket')
  }

  /**
   * 选择关键字
   */
  private onKeywordClicked(item) {
    this.sendMessage(MsgTypeKV.selectKeyword, {
      kwId: item.kwId,
    });
  }


  /**
   * 将返回的音源url发送为自定义消息
   */
  private $getSoundUrl(data: any) {
    if (data.result === 0) {
      // this.userInfo = data.userInfo;
      let mediaUrl = data.mediaUrl;
      this.sendSound(mediaUrl);
    } else {
      this.$createToast({
        txt: data.message,
        type: "warn",
        time: 3000
      }).show();
    }
  }

  /**
   * 获取群助手列表
   */
  private $getGroupHelper(data: any) {
    if (data.result === 11) {
      // 显示“还没有关键字”
      // this.currentHelper = data.robot;
      this.$createToast({
        txt: data.message,
        type: "warn",
        time: 3000
      }).show();
      this.$router.push({
        name: 'GroupHelper'
      })
    } else if (data.result === 10) {
      // 显示“还没有群助手”
      this.$createToast({
        txt: data.message,
        type: "warn",
        time: 3000
      }).show();
      this.$router.push({
        name: 'GroupHelper'
      })
    } else if (data.result === 0) {
      // 有助手也有关键字列表
      // this.currentHelper = data.robot;
      this.keywordList = data.keywordList;
    } else {
      this.$createToast({
        txt: data.message,
        type: "warn",
        time: 3000
      }).show();
    }
  }

  /**
   * 选择关键字
   */
  private $selectKeyword(data: any) {
    if (data.result === 0) {
      this.$createToast({
        txt: data.message,
        type: "correct",
        time: 3000
      }).show();
      this.showKeywordList = false;
      this.showFaceList = false;
      this.showToolList = true;
    } else {
      this.$createToast({
        txt: data.message,
        type: "warn",
        time: 3000
      }).show();
    }
  }

}
</script>
